<template>
  <div>
    <!-- 添加或修改参数配置对话框 -->
    <el-dialog class="dia-style" :title="title" :visible.sync="open" append-to-body>
      <HkForm
        ref="hkFormRef"
        :formLabels="formObj.formLabels"
        :rules="formObj.formRules"
        :data="form"
        :dict-list="formObj.dictList"
        :btn-hidden="true">
      </HkForm>

      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">保 存</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { updateType, addType } from '@/api/system/dict/type'
import HkForm from '@/components/HKForm/index.vue'
export default {
  dicts: ['dict_status'],
  data() {
    return {
      // 是否展示遮罩层
      open: false,
      // 查询对象
      formObj: {
        formLabels: [
          {
            label: '字典名称',
            field: 'dictName',
            type: 'input',
            maxlength:50,
            span: 24,
          },
          {
            label: '字典类型',
            field: 'dictType',
            type: 'input',
            maxlength:50,
            span: 24,
          },
          {
            label: '状态',
            field: 'status',
            type: 'radio',
            list: 'statusList',
            span: 24,
          },
          {
            label: '备注',
            field: 'remark',
            type: 'textarea',
            maxlength:256,
            span: 24,
          },
        ],
        // 表单校验
        formRules: {
          dictName: [{ required: true, message: '字典名称不能为空', trigger: 'blur' }],
          dictType: [{ required: true, message: '字典类型不能为空', trigger: 'blur' }],
        },
        // 数据准则列表
        dictList: {
          statusList: [
            {
              label: '正常',
              value: 0,
            },
            {
              label: '停用',
              value: 1,
            },
          ],
          dataScopeList: [],
        },
      },
    }
  },
  computed: {
    form: {
      get() {
        return this.transForm
      },
      set(val) {},
    },
  },
  props: {
    title: {
      type: String,
      default: '',
    },
    transForm: {
      type: Object,
      default: {},
    },
  },
  methods: {
    /** 提交按钮 */

    async submitForm() {
      let res = await this.$refs.hkFormRef.handleFormSubmit('formLabels')
      if (res && this.form.id != undefined) {
        updateType(Object.assign({}, res, { id: this.form.id })).then((response) => {
          this.$modal.msgSuccess('修改成功')
          this.open = false
          this.$emit('submitForm')
        })
      } else {
        addType(res).then((response) => {
          this.$modal.msgSuccess('新增成功')
          this.open = false
          this.$emit('submitForm')
        })
      }
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.form = {
        dictId: undefined,
        dictName: undefined,
        dictType: undefined,
        status: '0',
        remark: undefined,
      }
    },
  },
  mounted() {},
  components: { HkForm },
  watch: {
    transForm(newValue, oldValue) {},
  },
}
</script>

<style lang="scss" scoped></style>
